<!doctype html>
<html lang="zh-CN">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    {% block title %}
     <title>Bootstrap 101 Template</title>
    {% endblock %}


    <!-- Bootstrap -->
    <link rel="stylesheet" href="/static/js/bootstrap-3.4.1-dist/css/bootstrap.min.css">
<!--    header~~~~~~~~~~~~~~@@@@@@@@@@@#############-->





  {% block css %}

  {% endblock %}
  </head>
  <body>


    {% block body %}

    {% endblock %}


    <!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
    <script src="/static/js/jquery.min.js"></script>


    <script src="/static/js/bootstrap-3.4.1-dist/js/bootstrap.min.js"></script>
    <script>

<!--    悬停展示-->
    $(document).ready(function() {
    $('.cccc').mouseover(
        function() {
            $(this).addClass('open');
            $(this).find('.dropdown-toggle').attr('aria-expanded', 'true');
        }
    );
    $('.cccc').mouseleave(
        function() {
            $(this).removeClass('open');
            $(this).find('.dropdown-toggle').attr('aria-expanded', 'false');
        }
    );
});

    $(document).ready(function () {
        let tag_list = ["label-default", "label-success", "label-info", "label-primary", "label-warning", "label-danger"];
        let tags = document.getElementsByClassName("mytag");

        for (let tag of tags) {
            // 生成一个随机索引
            let index = Math.floor(Math.random() * tag_list.length); // 使用 Math.floor 来确保索引是整数
            $(tag).addClass(tag_list[index]); // 将原生 DOM 元素转换为 jQuery 对象
        }
    });

</script>


    {% block js %}

  {% endblock %}
  </body>
</html>